<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>首页</title>
<script type="text/javascript" src="../../staticresource/js/jquery.min.js"></script>
<script type="text/javascript" src="../../staticresource/js/base/base.js"></script>
<script type="text/javascript"
	src="../../staticresource/js/webuploader-0.1.5/webuploader.min.js"></script>
<link rel="stylesheet" href="../../staticresource/css/login.css" />
<link rel="stylesheet" href="../../staticresource/js/webuploader-0.1.5/webuploader.css" />
<style>
</style>
</head>

<body>
	<button id="loginbtn" type="button" onclick="loginOut();">退出</button>
	<br>
	<button id="loginbtn" type="button" onclick="addUser();">增加用户</button>
	<br>
	<button id="loginbtn" type="button" onclick="loadUserMenu();">加载用户菜单</button>
	<button id="loginbtn" type="button" onclick="updateUser();">修改用户</button>
	<a target='_blank' href='http://192.168.0.52:8080/mayi/file/downloadFile?id=402880b452ede5280152ede594650001'>下载文件</a>
	<br>
	<h1>测试上传附件</h1>
	<div id="uploader" class="wu-example">
		<div id="thelist" class="uploader-list"></div>
		<div class="btns">
			<div id="picker">选择文件</div>
		</div>
		<button id="ctlBtn" class="btn btn-default"
			onclick="updateUserAttachment();">确定修改</button>
	</div>
</body>
<script>
	function loginOut() {
		$.ajax({
			url : basePath + "login/loginOut",
			type : "post",
			dataType : "json",
			success : function(data) {
				if (data.flag) {
					window.location.href = basePath + "html/login.html";
				}
			}
		})
	}
	function addUser() {
		$.ajax({
			url : basePath + "login/addUser",
			type : "post",
			dataType : "json"
		})
	}
	var fileId;
	function updateUserAttachment() {
		$.ajax({
			url : basePath + "user/updateUserAttachment",
			data : {
				fileId : fileId,
				name : name
			},
			type : "post",
			dataType : "json",
			success : function(reeult) {

			}
		})
	}
	function loadUserMenu() {
		$.ajax({
			url : basePath + "login/loadUserMenu",
			type : "post",
			dataType : "json"
		})
	}
	var uploadersetting = {
		url : basePath + "file/uploadFile",
		pickid : "picker",
		fileQueuedCB : fileQueuedCB,
		uploadProgressCB : uploadProgressCB,
		uploadSuccessCB : uploadSuccessCB,
		uploadErrorCB : uploadErrorCB
	};
	var uploader = initWebUpLoader(uploadersetting);
	//文件被增加到上传队列后的回掉函数
	function fileQueuedCB(file) {
		console.info(file.name + "被加入到上传队列");
		console.info(file);
		name = file.name;
		var dom = [];
		dom.push("<div id='"+file.id+"'>");
		dom.push("<label>" + file.name + "</label>");
		dom
				.push("<input type='button' value='移除文件' onclick='removeFile(this);' data-id='"
						+ file.id + "'>");
		dom.push("</div>");
		dom.push("<label>验证是否支持秒传</label><label id="+file.id+"></label>");
		dom
				.push("<label>文件上传进度</label><label id='upload_"+file.id+"'></label>");
		$("#thelist").append(dom.join(""));
		// 计算MD5值的进度
		var promise = uploader.md5File(file);
		promise.progress(function(percentage) {
			$("#" + file.id).text(percentage);
		})
		// MD5值计算完成完成,请求服务器验证
		promise.then(function(val) {
			$.ajax({
				url : md5url,
				data : {
					md5Value : val,
					size : file.size,
					type : file.type
				},
				type : "post",
				dataType : "json",
				async : false,
				success : function(result) {
					if (result.id) {
						console.info("支持秒传，对应服务器文件ID-->>" + result.id);
						fileId = result.id;
						removeFileFromQueue(file.id);
					} else {
						console.info("不支持秒传");
						file.md5Vaule = val;
						uploader.upload();
					}
				}
			})
		});
	}
	//文件上传进度回掉函数
	function uploadProgressCB(file, percentage) {
		console.info(file.name + "当前进度为：" + percentage);
		$("#upload_" + file.id).text(percentage);
	}
	//文件上传成功回掉函数(response:服务器端返回的JSON信息)
	function uploadSuccessCB(file, response) {
		console.info(file.name + "上传成功" + JSON.stringify(response));
		fileId = response.fileId;
	}
	//文件上传失败回掉函数
	function uploadErrorCB(file) {
		console.info(file.name + "上传失败");
	}
	//移除文件
	function removeFile(obj) {
		var fileid = $(obj).attr("data-id");
		$("#" + fileid).remove();
		removeFileFromQueue(fileid);
	}
	//上传按钮点击事件
	function start() {
		uploader.upload();
	}
	//下载文件 
	function downloadFile() {
		$.ajax({
			url : basePath + "file/downloadFile",
			data : {
				id : "402880b452ed07580152ed0aea9e0009"
			},
			type : "post"
		})
	}
</script>
</html>
